const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");

// 无需手动导入 createProxyMiddleware！原生 proxy 会自动依赖
module.exports = {
  mode: "development",
  name: "predict-system-compilation",
  entry: {
    main: "./js/main.js",
    input: "./js/input.js",
    func1: "./js/func1.js",
    func2: "./js/func2.js",
    predict: "./js/predict.js",
    work: "./js/work.js",
    
  },
  output: {
    filename: "[name].[contenthash:8].js",
    path: path.join(__dirname, "dist")
  },
  module: {
    rules: [
      { test: /\.css$/, use: ["style-loader", "css-loader"] },
      { 
        test: /\.(jpg|jpeg|png|gif|svg)$/i,
        type: "asset/resource",
        generator: { filename: "images/[name].[hash:8][ext]" }
      },
      { test: /\.js$/, exclude: /node_modules/, use: "babel-loader" }
    ]
  },
  plugins: [
    new CleanWebpackPlugin(),
    new HtmlWebpackPlugin({ template: "./src/main.html", filename: "main.html", chunks: ["main", "work"] }),
    new HtmlWebpackPlugin({ template: "./src/input.html", filename: "input.html", chunks: ["input", "work"] }),
    new HtmlWebpackPlugin({ template: "./src/func1.html", filename: "func1.html", chunks: ["func1", "work"] }),
    new HtmlWebpackPlugin({ template: "./src/func2.html", filename: "func2.html", chunks: ["func2"] }),
    new HtmlWebpackPlugin({ template: "./src/predict.html", filename: "predict.html", chunks: ["predict"] }),
    new HtmlWebpackPlugin({ template: "./src/404.html", filename: "404.html", chunks: [] }),
    new HtmlWebpackPlugin({ template: "./src/50x.html", filename: "50x.html", chunks: [] })
  ],
  devServer: {
    static: {
      directory: path.join(__dirname, "src"),
      publicPath: "/"
    },
    compress: true,
    port: 9000,
    historyApiFallback: true,
    open: true,
    // --------------------------
    // 关键：原生 proxy 数组配置（Webpack 自动处理，不会丢 target）
    // --------------------------
    proxy: [
      {
        context: ["/api/v1"], // 匹配所有 /api/v1 开头的请求（必写）
        target: 'http://192.168.209.178:8000',// 后端地址（手动输入，无隐藏字符）
        changeOrigin: true, // 必开：解决跨域 Origin 问题
        secure: false, // 后端是 HTTP，禁用 HTTPS 证书校验
        logLevel: "debug", // 强制打印日志，方便验证
        withCredentials: true, // 携带 Cookie
        // 处理 OPTIONS 预检请求（确保浏览器先发的 OPTIONS 能转发）
        onProxyReq: (proxyReq, req) => {
          if (req.method === "OPTIONS") {
            proxyReq.headers["Access-Control-Request-Method"] = "POST";
            proxyReq.headers["Access-Control-Request-Headers"] = "Content-Type";
            proxyReq.headers["Access-Control-Allow-Origin"] = "*";
          }
        },
        // 确保后端返回的 CORS 头正确（兜底）
        onProxyRes: (proxyRes) => {
          proxyRes.headers["Access-Control-Allow-Origin"] = "*";
          proxyRes.headers["Access-Control-Allow-Credentials"] = "true";
        }
      }
    ]
    // --------------------------
  },
  resolve: {
    extensions: [".js", ".css"],
    modules: [
      path.resolve(__dirname, "js"),
      path.resolve(__dirname, "css"),
      path.resolve(__dirname, "picture"),
      "node_modules"
    ]
  }
};

// const path = require("path");
// const HtmlWebpackPlugin = require("html-webpack-plugin");
// const { CleanWebpackPlugin } = require("clean-webpack-plugin");

// module.exports = {
//   mode: "development",
//   entry: {
//     main: "./js/main.js",
//     input: "./js/input.js",
//     func1: "./js/func1.js",
//     func2: "./js/func2.js",
//     predict: "./js/predict.js",
//     test: "./js/test.js",
//     work: "./js/work.js",
//     T: "./js/T.js"
//   },
//   output: {
//     filename: "[name].[hash:8].js",
//     path: path.join(__dirname, "dist")
//   },
//   module: {
//     rules: [
//       {
//         test: /\.css$/,
//         use: ["style-loader", "css-loader"]
//       },
//       {
//         test: /\.(jpg|jpeg|png|gif|svg)$/i,
//         type: "asset/resource",
//         generator: {
//           filename: "images/[name].[hash:8][ext]"
//         }
//       },
//       {
//         test: /\.js$/,
//         exclude: /node_modules/,
//         use: "babel-loader"
//       }
//     ]
//   },
//   plugins: [
//     new CleanWebpackPlugin(),
//     new HtmlWebpackPlugin({
//       template: "./src/main.html",
//       filename: "main.html",
//       chunks: ["main", "work"]
//     }),
//     new HtmlWebpackPlugin({
//       template: "./src/input.html",
//       filename: "input.html",
//       chunks: ["input", "work"]
//     }),
//     new HtmlWebpackPlugin({
//       template: "./src/func1.html",
//       filename: "func1.html",
//       chunks: ["func1", "work"]
//     }),
//     new HtmlWebpackPlugin({
//       template: "./src/func2.html",
//       filename: "func2.html",
//       chunks: ["func2"]
//     }),
//     new HtmlWebpackPlugin({
//       template: "./src/predict.html",
//       filename: "predict.html",
//       chunks: ["predict"]
//     }),
//     new HtmlWebpackPlugin({
//       template: "./src/T.html",
//       filename: "T.html",
//       chunks: ["T"]
//     }),
//     new HtmlWebpackPlugin({
//       template: "./src/404.html",
//       filename: "404.html",
//       chunks: []
//     }),
//     new HtmlWebpackPlugin({
//       template: "./src/50x.html",
//       filename: "50x.html",
//       chunks: []
//     })
//   ],
//   devServer: {
//     static: {
//       directory: path.join(__dirname, "dist"),
//       publicPath: "/",
//     },
//     compress: true,
//     port: 9000,
    
    
//     // --- 这里是修改的部分 ---
//     proxy: [
//       {
//         context: ['/api/v1'],
//         target: 'http://192.168.1.171:8080', // 目标服务器地址
//         changeOrigin: true, // 必须设置为 true
//         secure: false,
//         logLevel: 'debug',
//         withCredentials: true
        
//       }
//     ]
//     // --- 修改结束 ---
//   },
//   resolve: {
//     extensions: [".js", ".css"],
//     modules: [path.resolve(__dirname, "js"), path.resolve(__dirname, "css"), path.resolve(__dirname, "picture"), "node_modules"]
//   }
// };